import './App.scss'
//导入路由
import { Router, Route, Switch, Redirect } from 'react-router-dom'
import AuthRoute from '@/components/AuthRoute'

import { lazy, Suspense } from 'react'

import { history } from '@/utils/history'
import { Spin } from 'antd'
// import GeekLayout from './pages/Layout'
//导入页面
const Login = lazy(() => import('./pages/Login'))
const GeekLayout = lazy(() => import('./pages/Layout'))
const NotFound = lazy(() => import('./pages/NotFound'))

//配置路由规则
const App = () => {
  return (
    <Router history={history}>
      <Suspense
        fallback={
          <div className="loding">
            <Spin tip="加载中" />
          </div>
        }
      >
        {/*<Suspense fallback={<div className="loading">loading...</div>}>*/}
        <div className="App">
          <Switch>
            <Route exact path="/" render={() => <Redirect to="/home" />} />
            <AuthRoute path="/home" component={GeekLayout}></AuthRoute>
            <Route path="/login" component={Login}></Route>

            <Route>
              <NotFound></NotFound>
            </Route>
          </Switch>
        </div>
      </Suspense>
    </Router>
  )
}

export default App
